<style type="text/css">
    .btn{position: relative;overflow: hidden;margin-right: 4px;display:inline-block;
        *display:inline;padding:4px 10px 4px;font-size:14px;line-height:18px;
        *line-height:20px;color:#fff;
        text-align:center;vertical-align:middle;cursor:pointer;background:#5bb75b;
        border:1px solid #cccccc;border-color:#e6e6e6 #e6e6e6 #bfbfbf;
        border-bottom-color:#b3b3b3;-webkit-border-radius:4px;
        -moz-border-radius:4px;border-radius:4px;}
    .btn input{position: absolute;top: 0; right: 0;margin: 0;border:solid transparent;
        opacity: 0;filter:alpha(opacity=0); cursor: pointer;}
    a:link,a:visited{ text-decoration:none;}
</style>


<div class="modal fade" id="mys" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true" style=" margin-left: 100px;">
    <div class="modal-dialog" style="width: 1100px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
            </div>
            <div class="modal-body" id="yuans">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                </button>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
    function setData(res) {
        var info = "<tr>";
        var y = 0;
        for(var i = 0; i<res.length; i++){
            if(y == 10){
                info = info + "</tr><tr>";
                y = 0;
            }
            info = info + "<td height='130px;' style='text-align: center;'><img src='__IMG__"+res[i].path+
                "' width='80px' height='60px' /><br /><br /><button class='btn-primary' " +
                "style='font-style: 12px;margin-right: 5px; border-radius: 4px;' onclick='Selected("+res[i].id+")' class=\"close\" data-dismiss=\"modal\" aria-hidden=\"true\">选中</button>" +
                "<button class='btn-primary' style='font-style: 12px; border-radius: 4px;' onclick='getDelete("+res[i].id+")'>删除</button></td>"
            y ++;
        }
        for(var i = y;i < 10; i++){
            info = info + "<td></td>";
        }
        var html = "<table width='100%'>" +
            info +
            "</table>";
        document.getElementById("yuans").innerHTML = html;
    }
    $(document).ready(function(){
        $("#buttonModels").click(function(){
            $.ajax({
                url: '__HTTP__/Upload/getUpload',
                success: function (res) {
                    console.log(res);
                    setData(res);
                }
            })
        })
    });

    function Selected(id) {
        var image = document.getElementById("imgs");
        document.getElementById("img").value=id;
        $.ajax({
            url: '__HTTP__/Upload/getUpload',
            success: function (res) {
                for(var i = 0; i<res.length; i++){
                    if(id == res[i].id){
                        image.setAttribute("src","__IMG__"+res[i].path);
                        document.getElementById("imgs").value=id;
                    }
                }
            }
        })
    }
    function getDelete(id) {
        $.ajax({
            url:'__HTTP__/Upload/getDel',
            type:"POST",
            data:{
                'id':id
            },
            success:function (res) {
                SUCCSSAlert("图片删除成功");
            }
        });
    }
</script>